<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>资源审核</title>
    <link rel="stylesheet" href="/src/css/base.css">
    <link rel="stylesheet" href="/src/css/menu.css">
    <script src="/src/dep/js/vue.js"></script>
    <link rel="stylesheet" href="/src/dep/element-ui/2.13.2/index.css">
    <script src="/src/js/ajax.js"></script>
    <script src="/src/js/base.js"></script>
    <script src="/src/dep/element-ui/2.13.2/index.js"></script>
    <style>
        body,html{
            background-image: none;
            background: none;
        }
        #verify{
            background-color: white;
            width: 100%;
            max-width: 440px;
            position: fixed;
            top: 120px;
            left: 0;
            right: 0;
            margin: auto;
            box-shadow: 0px 0px 5px 5px darkgray;
            padding: 10px;
            pointer-events: none;
            opacity: 0;
            transition: all 0.3s;
            transform: scale(1.1);
            z-index:10;
        }
        #verify.show{
            transform: scale(1);
            opacity: 1;
            pointer-events: all;
            animation: slide-in .3s;
        }
    </style>
</head>
<body>
    <div id="app" class="app">
        <el-pagination
            :page-size="count"
            layout="total, prev, pager, next, jumper"
            :total="total"
            @current-change="loadData"
            >
        </el-pagination>
        <el-table :data="list" style="width: 100%;">
            <el-table-column prop="id" label="id" width="40"></el-table-column>
            <el-table-column prop="file" label="文件名" width="180"></el-table-column>
            <el-table-column prop="file_describe" label="文件描述" width="140"></el-table-column>
            <el-table-column prop="path" label="请求路径"></el-table-column>
            <el-table-column prop="save_path" label="存储路径"></el-table-column>
            <el-table-column label="状态" width="80">
                <template slot-scope="scope">
                    {{scope.row.status == 0?"待审核":scope.row.status == -1?"已拒绝":"已通过"}}
                </template>
            </el-table-column>
        </el-table>
    </div>
    <div id="verify" :class="{show:show}">
        <h3 style="margin-left: 30px;">信息确认</h3>
        <div class="form-item">
            <label for="">邮箱</label>
            <p class="content">{{fileInfo.email}}</p>
        </div>
        <div class="form-item">
            <div class="input-group active">
                <span>文件名</span>
                <input name="name" autocomplete="off" v-model="fileInfo.file">
            </div>
        </div>
        <div class="form-item">
            <div class="input-group active">
                <span>存储路径</span>
                <input name="path" autocomplete="off" v-model="fileInfo.path">
            </div>
        </div>
        <div class="form-item">
            <div class="input-group textarea">
                <span>管理员留言</span>
                <textarea v-model="fileInfo.message" name="message" id="" cols="30" rows="10"></textarea>
            </div>
        </div>
        <div class="form-item">
            <el-checkbox style="transform: translateY(-10px);" v-model="fileInfo.noSendEmail">不发送邮件提醒</el-checkbox>
        </div>
        <div style="display: flex;justify-content: flex-end;">
            <button class="primary" style="margin-right: 10px;" @click="send">确定</button>
            <button @click="cancle">取消</button>
        </div>
    </div>
    <script>
        app = new Vue({
            el:"#app",
            data:{
                list:[],
                total:0,
                count:10
            },
            created(){
                this.loadData()
            },
            methods: {
                pass(data){
                    verify.active(data)
                    verify.operate = "pass"
                },
                refuse(data){
                    verify.active(data)
                    verify.operate = "refuse"
                },
                loadData(page){
                    aoej.load()
                    if(page == undefined){
                        page = 0;
                    }
                    $ajax("POST","/api/admin/Contribute/getAllVerifyList",{page:page,count:this.count},(e)=>{
                        aoej.finish()
                        if(e.data.status != 1){
                            $confirm("错误","<p>代码：" + e.data.status + "</p><p>服务器消息：" + e.data.msg + "</p><p>是否重新加载</p>",(e)=>{
                                if(e){
                                    this.loadData(page)
                                }
                            })
                        }else{
                            this.list = e.data.data
                            this.total = e.data.total
                        }
                    })
                }
            }
        })
        verify = new Vue({
            el:"#verify",
            data:{
                show:false,
                mask:"",
                fileInfo:{
                    message:"",
                    noSendEmail:false
                },
                operate:"pass"
            },
            created(){
                this.mask = insertMask()
                this.mask.style.zIndex=9
            }
            ,methods:{
                active(data){
                    this.fileInfo = JSON.parse(JSON.stringify(data))
                    this.show = true
                    this.mask.show()
                },
                cancle(){
                    this.show = false
                    this.mask.hid()
                },
                send(){
                    aoej.load()
                    var url = this.operate=="pass"?"/api/admin/Contribute/pass":"/api/admin/Contribute/refuse"
                    console.log(this.fileInfo);
                    $ajax("post",url,this.fileInfo,(res)=>{
                        aoej.finish()
                        console.log(res.data);
                        if(res.data.status == 1){
                            $alert("提示","操作成功!",()=>{
                                app.loadData()
                                this.cancle()
                            })
                        }else{
                            $alert("提示","错误：" + res.data.msg,()=>{
                                app.loadData()
                            })
                        }
                    })
                }
            }
        })
    </script>
</body>
</html>
